<template>

  <div :class="'login-background linear-gradient-'+bgImgRandom">
          
    <div class="login-box">
     <el-form :model="loginParam" :rules="loginRules" ref="ruleFormRef" label-position="left" label-width="0px" class="demo-ruleForm login-container">
				<h3 class="title">文档管理-系统登录</h3>
				<el-form-item prop="username">
					<el-input type="text" v-model="loginParam.username" auto-complete="off" placeholder="账号" @keyup.enter.native="loginSubmit"></el-input>
				</el-form-item>
				<el-form-item prop="password">
					<el-input type="password" v-model="loginParam.password" auto-complete="off" placeholder="密码" @keyup.enter.native="loginSubmit"></el-input>
				</el-form-item>
				<el-form-item style="width:100%;">
					<el-button type="primary" style="width:100%;" @click.native.prevent="loginSubmit" :loading="loginLoading">登录</el-button>
				</el-form-item>
			</el-form>
    </div>
  </div>
</template>
<script setup lang='ts'>
import { ref,reactive,defineEmits} from 'vue'
import consoleApi from '@/common/api/console'
import { useRouter,useRoute } from 'vue-router'

const $router = useRouter();
const $route = useRoute();
const loginLoading = ref(false)


const loginParam =reactive({
  username: '',
  password: ''
})

const loginRules = reactive({
  username: [{required: true, message: '请输入账号', trigger: 'blur'},
    {
			min: 2,
			max: 25,
			message: '长度在 2 到 25 个字符',
			trigger: 'blur',
		}
  ],
  password: [{required: true, message: '请输入密码', trigger: 'blur'}],
})

const $emit = defineEmits(['loginSuccess1'])

let ruleFormRef = ref()
const loginSubmit = () => {

  console.log(ruleFormRef.value)
  ruleFormRef.value.validate((validate)=>{
    if (!validate) return;
    console.log("要跳转的地点",$route.query.redirect);
     consoleApi.userLogin(loginParam).then(()=>{
      $emit('loginSuccess1');
      if(!!$route.query.redirect){
          location.href = decodeURIComponent($route.query.redirect);
      }else{
        $router.back();
      }
            // 
						// this.loginLoading = false;
						// if (!!this.redirect) {
						// 	location.href = decodeURIComponent(this.redirect);
						// } else {
						// 	this.$router.back();
						// }
     })
    
  })
}
</script>
<style scoped lang='scss'>
  .login-container{
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		background-clip: padding-box;
		margin: 0 auto;
		width: 30vw;
		padding: 35px 35px 15px 35px;
		background: #fff;
		border: 1px solid #eaeaea;
		box-shadow: 0 0 25px #cac6c6;
    
  }
</style>